<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>考勤系统后台</title>
    
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />    
    
    <link href="${pageContext.request.contextPath }/dist/css/bootstrap.min.css" rel="stylesheet" />
    <link href="${pageContext.request.contextPath }/dist/css/bootstrap-responsive.min.css" rel="stylesheet" />
    
    <link href="http://fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600" rel="stylesheet" />
    <link href="${pageContext.request.contextPath }/dist/css/font-awesome.css" rel="stylesheet" />
    
    <link href="${pageContext.request.contextPath }/dist/css/adminia.css" rel="stylesheet" /> 
    <link href="${pageContext.request.contextPath }/dist/css/adminia-responsive.css" rel="stylesheet" /> 
    
    <link href="${pageContext.request.contextPath }/dist/css/pages/dashboard.css" rel="stylesheet" /> 
    
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head>

<body>
	
<div class="navbar navbar-fixed-top">
	
	<div class="navbar-inner">
		
		<div class="container">
			
			<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
				<span class="icon-bar"></span> 
				<span class="icon-bar"></span> 
				<span class="icon-bar"></span> 				
			</a>
			
			<a class="brand" >考勤系统</a>
			
			<div class="nav-collapse">
			
				<ul class="nav pull-right">
					<li>
						<a href="#"><span class="badge badge-warning">7</span></a>
					</li>
					
					<li class="divider-vertical"></li>
					
					<li class="dropdown">
						
						<a data-toggle="dropdown" class="dropdown-toggle " href="#">
							${sessionScope.admin.adminName} <b class="caret"></b>							
						</a>
						
						<ul class="dropdown-menu">
							<li>
								<a href="#"><i class="icon-user"></i> 账户设置 </a>
							</li>
							
							<li><a href=""  data-toggle="modal" data-target="#change_admin_pwd"><i class="icon-lock"></i> 修改密码</a></li>
							
							<li class="divider"></li>
							
							<li>
								<a href="${pageContext.request.contextPath }/AdminController?op=adminQuit"><i class="icon-off"></i>退出</a>
							</li>
						</ul>
					</li>
				</ul>
				
			</div> <!-- /nav-collapse -->
			
		</div> <!-- /container -->
		
	</div> <!-- /navbar-inner -->
	
</div> <!-- /navbar -->




<div id="content">
	
	<div class="container">
		
		<div class="row">
			
			<div class="span3">
				
				<div class="account-container">
				
					<div class="account-avatar">
					<c:if test="${sessionScope.admin.adminAvatarAddr != null }">
									<a  data-toggle="modal" data-target="#updPic"><img src="${pageContext.request.contextPath}/EmployeesController?op=getPic&fileName=${sessionScope.admin.adminAvatarAddr}" alt="" class="thumbnail" id="adImg" ></a>
								</c:if>
								<c:if test="${sessionScope.admin.adminAvatarAddr == null }">
										<a  data-toggle="modal" data-target="#updPic"><img src="${pageContext.request.contextPath}/EmployeesController?op=getPic&fileName=labi.jpg" alt="" class="thumbnail" id="adImg"  ></a>
					</c:if>
					</div> <!-- /account-avatar -->
				
					<div class="account-details">
					
						<span class="account-name">${sessionScope.admin.adminName}</span>
						
						<span class="account-role">${sessionScope.admin.adminId}号管理员</span>
						
						<span class="account-actions">
							<a href="javascript:;">个人资料</a> |
							
							<a href="javascript:;">账户管理</a>
						</span>
					
					</div> <!-- /account-details -->
				
				</div> <!-- /account-container -->
				
				<hr />
				
				<ul id="main-nav" class="nav nav-tabs nav-stacked">
					
					<li >
						<a href="${pageContext.request.contextPath }/Admin/Index.jsp">
							<i class="icon-home"></i>
							回主页
						</a>
					</li>
					
					<li>
						<a href="${pageContext.request.contextPath }/Admin/leaveApproval.jsp">
							<i class="icon-th-list"></i>
							请假审批
						</a>
					</li>
					
					<li class="active">
						<a href="${pageContext.request.contextPath }/Admin/kaoqgl.jsp">
							<i class="icon-signal"></i>
							考勤管理	
						</a>
					</li>
					
					<li >
						<a href="${pageContext.request.contextPath }/Admin/yuanggl.jsp">
							<i class="icon-user"></i>
							员工管理							
						</a>
					</li>
					
					<li>
						<a href="${pageContext.request.contextPath }/Admin/regAdmin.jsp">
							<i class="icon-user"></i>
							账户管理
						</a>
					</li>
				</ul>
				
				<hr />
			
		<form action=""  >	 	 	 
	  	 		<h5 style="font-size: 15px;">	  	 		
				<span>工&nbsp;号</span> 
				<input type="text" id="reId1" value="" name="recordid" placeholder="工号"  style="width:80px;height:18px;"/>
				<span >&nbsp;&nbsp;&nbsp;&nbsp;姓&nbsp;名</span> 				
				<input type="text" id="reName1" value="" name="reName1" placeholder="姓名" style="width:70px;height:18px;"/>
				<br/>
				<span >部&nbsp;门</span> 
				<select  id="deptNames1" style="width:90px;height:28px;">					
						<option value=""></option>
				</select>
				<span>&nbsp;&nbsp;&nbsp;&nbsp;状&nbsp;态</span>				
							<select  id="clock1" style="width:80px;height:28px;" >
							<option value=""></option>
							<option value="正常">正常</option>
							<option value="迟到">迟到</option>
							<option value="早退">早退</option>	
							<option value="旷工">旷工</option>				
						</select>							
				<br/>
				<span>起&nbsp;始&nbsp;时&nbsp;间</span> &nbsp;&nbsp;		
				<input type="date" name="data" id="retime1" value="" style="width:166px;height:18px;"/>
				 <br/><span>结&nbsp;束&nbsp;时&nbsp;间</span>&nbsp;&nbsp;&nbsp;
				<input type="date" name="data" id="retime2" value="" style="width:166px;height:18px;"/>
				<br/>	
				<input type="button" class="btn btn-default" id="querydss" value="查&nbsp;&nbsp;询" style="width:200px;height:30px;">
					&nbsp;&nbsp;
				<button type="reset" class="btn btn-success" style="width:50px;height:30px;">清&nbsp;&nbsp;除</button>	
			</h5>
			<hr />			
			</form>	
			</div> <!-- /span3 -->
			
			<div class="span9">
				
				<h2 class="">
					<i class="icon-th-large"></i>
					考勤管理				
				</h2>
		 		<hr />	
	  	 
          <div class="table-responsive"  style="height:550px">
         
            <table class="table table-striped">
              <thead>
                <tr style="font-size: 15px;">
                  <th>工号</th>
                  <th>姓名</th>
                  <th>部门</th>
                  <th>正常/天</th>
                  <th>迟到/天</th>
                  <th>早退/天</th>           
                  <th>旷工/天</th>
                  <th>起始时间</th>
                  <th>结束时间</th>
                  <th>操作</th>
                </tr>
              </thead>
              <tbody id="tbodyss">
			  
              </tbody>
            </table>
                <div>          	           			
          		<span style="font-size: 20px;">&nbsp;&nbsp;&nbsp;&nbsp; 每页<select name="cars" class="scarsf"  style="width:50px;height:32px;margin-bottom:10px;">
          		<option value="5">5</option>			
    			 	<option value="3">3</option>
    			 	<option value="10">10</option>
    			</select>条
    			</span>
    				<span class="pagination" id="pageItem"  style="font-size: 15px;">	    										
				</span> 
				
				<a href="" data-toggle="modal" data-target="#myModal2">
				<button class="btn btn-success" style="width:74px;height:32px;margin-bottom:18px;float:right;margin-right:36px;">添加记录
				</button></a>		
				<br/>
										
    		</div>   		   			 	
    		<div style="text-align:right;font-size: 16px;">
    		<!-- 分页信息 -->
				<span id="showPageInfo" ></span>
				&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;									
    		</div>  		   			 	
          </div>
       
      </div>
    </div>
<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="width:700px;">
	<div class="modal-dialog">
	<form class="form-horizontal" role="form">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
					&times;
				</button>
				<h4 class="modal-title" id="myModalLabel">
					异常记录
				</h4>
			</div>
			<div class="modal-body">
				 <table class="table table-striped">
              <thead>
                <tr style="font-size: 15px;">
                  <th>序号</th>
                  <th>工号</th>                               
              	  <th>上班时间</th>
                  <th>下班时间</th>
                  <th>打卡详情</th>
                  <th>操作</th>
                </tr>
              </thead>
              <tbody id="tbodyfs">
			  
              </tbody>
            </table>					
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭
				</button>				
			</div>
		</div><!-- /.modal-content -->
		
		</form>
		
	</div><!-- /.modal -->
	
</div>
	
	
	<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal3" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="width:440px;">
	<div class="modal-dialog">
	<form class="form-horizontal" role="form" >
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
					&times;
				</button>
				<h4 class="modal-title" id="myModalLabel">
					修改记录
				</h4>
			</div>
			<div class="modal-body">
				
					<div class="form-group" >
						<div class="col-sm-8" style="height:35px;display:none;">
							<input type="text" class="form-control" id="recordIdg" name="recordIdg" style="width:160px;" readonly="readonly"/>							
						</div>
						<label for="empIdg" class="col-sm-2 control-label">员工工号&nbsp;&nbsp;</label>
						<div class="col-sm-8" style="height:35px;">
							<input type="text" class="form-control" id="empIdg" name="empIdg" style="width:160px;" readonly="readonly"/>							
						</div>												
					</div>
				
					<div class="form-group">
						<label for="beginTimeg" class="col-sm-2 control-label">上班时间&nbsp;&nbsp;</label>
						<div class="col-sm-8" style="height:35px;">
							<input type="datetime-local"  name="beginTimeg" id="beginTimeg" value="" style="width:160px;height:18px;"/>
						</div>
					</div>
					<div class="form-group">
						<label for="endTimeg" class="col-sm-2 control-label">下班时间&nbsp;&nbsp;</label>
						<div class="col-sm-8" style="height:35px;">
							<input type="datetime-local" name="endTimeg" id="endTimeg"  value="" style="width:160px;height:18px;"/>
						</div>
					</div>
					<div class="form-group">
						<label for="clockInDetailsg" class="col-sm-2 control-label">打卡详情&nbsp;&nbsp;</label>
						<div class="col-sm-8" style="height:35px;">
							<select  id="clockInDetailsg" style="width:80px;height:30px;" >					
							<option value="正常">正常</option>
							<option value="迟到">迟到</option>
							<option value="早退">早退</option>	
							<option value="旷工">旷工</option>				
						</select>
						</div>
					</div>														
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭
				</button>
				<button type="button" class="btn btn-primary" id="modifs">
					提交更改
				</button>
			</div>
		</div><!-- /.modal-content -->
		
		</form>
		
	</div><!-- /.modal -->
	
</div>								

	<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="width:440px;">
	<div class="modal-dialog">
	<form class="form-horizontal" role="form" >
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
					&times;
				</button>
				<h4 class="modal-title" id="myModalLabel">
					添加打卡记录
				</h4>
			</div>
			<div class="modal-body">
				
					<div class="form-group" >
						<label for="empIdt" class="col-sm-2 control-label">员工工号&nbsp;&nbsp;</label>
						<div class="col-sm-8" style="height:35px;">
							<input type="text" class="form-control" id="empIdt" name="empIdt" style="width:160px;"/>							
						</div>												
					</div>
					
					<!-- 显示用户名的提示 -->
       				<label id="empIds" style="padding-left:150px;color:#0000FF;"></label>       			
					<div class="form-group">
						<label for="empNamet" class="col-sm-2 control-label">员工姓名&nbsp;&nbsp;</label>
						<div class="col-sm-8" style="height:35px;">
							<input type="text" class="form-control" id="empNamet" name="empNamet" readonly="readonly" style="width:160px;"/>
						</div>
					</div>
					<div class="form-group">
						<label for="beginTimet" class="col-sm-2 control-label">上班时间&nbsp;&nbsp;</label>
						<div class="col-sm-8" style="height:35px;">
							<input type="datetime-local"  name="beginTimet" id="beginTimet" value="" style="width:160px;height:18px;"/>
						</div>
					</div>
					<div class="form-group">
						<label for="endTimet" class="col-sm-2 control-label">下班时间&nbsp;&nbsp;</label>
						<div class="col-sm-8" style="height:35px;">
							<input type="datetime-local" name="endTimet" id="endTimet" value="" style="width:160px;height:18px;"/>
						</div>
					</div>
					<div class="form-group">
						<label for="articleTitle" class="col-sm-2 control-label">打卡详情&nbsp;&nbsp;</label>
						<div class="col-sm-8" style="height:35px;">
							<select  id="clockInDetailst" style="width:80px;height:30px;" >
							<option value=""></option>
							<option value="正常">正常</option>
							<option value="迟到">迟到</option>
							<option value="早退">早退</option>	
							<option value="旷工">旷工</option>				
						</select>
						</div>
					</div>													
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">关闭
				</button>
				<button type="button" class="btn btn-primary" id="addReco">
					添加更新
				</button>
			</div>
		</div><!-- /.modal-content -->
		</form>
	</div><!-- /.modal -->
	
</div>	
</div>
</div>	

<!-- 修改头像模态框 -->
    <div class="modal fade" id="updPic">
		<div class="modal-dialog">
			<div class="modal-content" >
		
				<!-- 模态框头部 -->
				<div class="modal-header">
					<h4 class="modal-title">修改头像</h4>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>
			 <form id="updatePicForm" enctype="multipart/form-data" method="post">
				<!-- 模态框主体 -->
				<div class="modal-body">
				<input type="file" accept="image/gif,image/jpeg,image/jpg,image/png" name="ep" />
				</div>
			</form>
			
				<!-- 模态框底部 -->
				<div class="modal-footer">
					<button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-success" id="btup">确认修改</button>
				</div>
				
			
			</div>
		</div>
	</div>			
	
	<!-- 修改密码的模态框 -->
	<div class="modal fade" id="change_admin_pwd" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<form class="form-horizontal" role="form" >
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">&times;</button>
						<h4 class="modal-title" id="myModalLabel">修改密码</h4>
					</div>
					<div class="modal-body">

						<div class="form-group">
							<label for="previousPwd" class="col-sm-2 control-label">原密码</label>
							<div class="col-sm-8">
								<input type="password" class="form-control" id="previousPwd"
									name="previousPwd"  />
							</div>
						</div>
						<div class="form-group">
							<label for="newPwd" class="col-sm-2 control-label">新密码</label>
							<div class="col-sm-8">
								<input type="password" class="form-control" id="newPwd"
									name="newPwd" />
							</div>
						</div>

						<div class="form-group">
							<label for="newRePwd" class="col-sm-2 control-label">确认输入</label>
							<div class="col-sm-8">
								<input type="password" class="form-control" id="newRePwd"
									name="newRePwd" />
							</div>
						</div>

					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">关闭
						</button>
						<button type="button" class="btn btn-primary" id="updateBtn">提交更改</button>
					</div>
				</div>
				<!-- /.modal-content -->
			</form>
		</div>
		<!-- /.modal -->
	</div>					
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="${pageContext.request.contextPath}/dist/js/jquery-1.7.2.min.js"></script>
<script src="${pageContext.request.contextPath}/dist/js/bootstrap.js"></script>


  </body>
   
<script type="text/javascript">
$(function(){
	//点击事件触发模态框
	$("#updateBtn").click(function(){
		
		//var adminName=${sessionScope.admin.adminName};
		var	previousPwd=$("#previousPwd").val();
		var	newPwd=$("#newPwd").val();
		var	newRePwd=$("#newRePwd").val();
		
		
		
	if(newPwd==newRePwd){
		//发送Ajax请求修改密码
		$.get("${pageContext.request.contextPath }/AdminController",{op:"change_admin_pwd",previousPwd:previousPwd,newPwd:newPwd,adminName:"${sessionScope.admin.adminName}"},function(flag){
			if(flag){
				//关闭模态框后并刷新数据
				$("#change_admin_pwd").modal('hide');
				//
			}else{
				alert("账户密码错误,修改失败!")
			}
		},"json")
	}else{
		
		alert("两次密码不一致");
	}
	
	})
	$("#btup").click(function(){
		var formData = new FormData($("#updatePicForm")[0]);
		$.ajax({
			async : true,
			url : "${pageContext.request.contextPath}/AdminController?op=updatePic",
			type : "POST",
			data : formData,
			contentType : false,
			processData : false,
			success : function(admin) {
				var path = admin.adminAvatarAddr;
				$("#updPic").modal('hide');
				$("#adImg").attr("src","${pageContext.request.contextPath}/EmployeesController?op=getPic&fileName="+path+"&a=" + new Date().getTime());
			},
			error : function() {
				alert("异步请求失败");
			}
		})
	})
	//考勤管理显示
	vagueds(1);
	//每页显示n条
	$(".scarsf").blur(function(){
		vagueds(1);	
 	})
 	//跳转页面
   		 $(document).on("click","#tiao",function(){
   			var pageNo=$("#yema").val();
   			var totalPage=$("#totalPage").text();
   			if(pageNo<1){
   				pageNo=1;
   				$("#yema").val(pageNo);
   			}else if(pageNo>totalPage*1){
   				pageNo=totalPage;
   				$("#yema").val(pageNo);
   			}
   			vagueds(pageNo);
   		})  
     	//首页
   		$(document).on("click",".sy",function(){ 		    			
   			vagueds(1);	
   		})
   		//末页
   		$(document).on("click",".my",function(){
   			vagueds($("#totalPage").text());	
   		}) 
   		//上一页
   		$(document).on("click",".syy",function(){
   			vagueds(parseInt($("#pageNo").text())-1);	
   		})
   		//下一页
   		$(document).on("click",".xyy",function(){
   			vagueds(parseInt($("#pageNo").text())+1);	
   		})
   		//当前页
   		$(document).on("click",".dqy",function(){
   			vagueds($(this).text());	
   		})
	//验证是否有该员工
	$(document).on("blur","#empIdt",function(){ 
		$("#empIds").empty();
		$("#empNamet").empty();
		var empId=$("#empIdt").val()*1;
		 $.get("${pageContext.request.contextPath}/AttenController",{op:"vaguesf",empId:empId},function(datas){							  
				
			 	if($("#empIdt").val().trim()==""){
					$("#empIds").text("用户名不能为空");									
				}else if(datas!=null){
					var empIds=datas.empId*1;
					var empStatus=datas.empStatus*1;				
					 if(empIds==empId && empStatus==1 ){
						$("#empNamet").val(datas.empName);												
					}else if(empIds==empId && empStatus==0){
						$("#empNamet").val(datas.empName);
						$("#empIds").text("该员工已离职");
					}
				} else{
					$("#empIds").text("无该员工");					
				} 			 	
		},"json") 
		
	})
	
	//添加考勤记录
	$(document).on("click","#addReco",function(){ 					
			var clockInDetails=$("#myModal2 #clockInDetailst").val();
			if(clockInDetails=="正常"){
				clockInDetails=0;
			}
			if(clockInDetails=="迟到"){
				clockInDetails=1;
			}
			if(clockInDetails=="早退"){
				clockInDetails=2;
			}
			if(clockInDetails=="旷工"){
				clockInDetails=3;
			}
			var record={					    				
				beginTime:$("#myModal2 #beginTimet").val(),	
				endTime:$("#myModal2 #endTimet").val(),	
				clockInDetails:clockInDetails								     	  
			};
			if($("#empIds").text()==""){
			$.get("${pageContext.request.contextPath}/AttenController",{op:"addReco",empId:$("#empIdt").val()*1,record:JSON.stringify(record)},function(datas){
				 if(datas){		
				 	$("#myModal2").modal("hide");
		 			vagueds(1);
				 }else{
				 	alert("添加失败！");
				}					     		    		
			},"json") 	   					    
		}
		return false;
	})
	//根据id和时间查询考勤记录详情
	$(document).on("click","#vaguefs",function(){      			
		var empId=$(this).data("empid");
		var begin=$(this).data("begin");
		var end=$(this).data("end");
		$("#myModal #tbodyfs").empty();
		vagueFun(empId,begin,end);		
   	})
   	//删除考勤记录
   	$(document).on("click","#myModal .dels",function(){ 
   		var recordId=$(this).data("recordid");
		//删除员工  
		   var flag=confirm("是否确定删除："+recordId+"号 考勤记录");
		   if(flag){
			   //跳转页面
			 	$.get("${pageContext.request.contextPath}/AttenController",{op:"dels",recordId:recordId},function(datas){
			 		if(datas){
			 			$("#myModal").modal("hide");
			 			vagueds(1);
					}else{
						alert("删除失败！")
					}
				},"json")
		   }
	})
	//修改考勤记录
    	$(document).on("click","#modifs",function(){
    	var	clockInDetails=$("#myModal3 #clockInDetailsg").val();
    	if(clockInDetails=="正常"){
    		clockInDetails=0;
    	}
    	if(clockInDetails=="迟到"){
    		clockInDetails=1;
    	}
    	if(clockInDetails=="早退"){
    		clockInDetails=2;
    	}
    	if(clockInDetails=="旷工"){
    		clockInDetails=3;
    	}
    	var endTime=$("#myModal3 #endTimeg").val();
    	   
    	if(endTime==""){
    		endTime=null;
    	}
	    var record={
	    	recordId:$("#myModal3 #recordIdg").val(),
	    	beginTime:$("#myModal3 #beginTimeg").val(),
	    	endTime:endTime, 
	    	clockInDetails:clockInDetails		    		     	  					     	  			     	
	    };	    		
	   $.get("${pageContext.request.contextPath}/AttenController",{op:"modifs",record:JSON.stringify(record)},function(datas){
	 		if(datas){
				$("#myModal3").modal("hide");
	 			$("#myModal").modal('hide');
	 			vagueds(1);
	 		}else{
	 			alert("修改失败！")
	 			}
	     		    		
	 	},"json") 	       	       
   	}) 
	//按多条件查询考勤记录		
   	$("#querydss").click(function(){   	
   			vagueds(1);     			
     })
     
   //对查询选项部门选项做遍历显示
	$.get("${pageContext.request.contextPath}/StaffsController",{op:"dept"},function(datao){
		 $.each(datao,function(index,dep){
			 $("#deptNames1").append('<option value="'+dep.deptName+'">'+dep.deptName+'</option>');
		 })
	},"json") 
})
//后台考勤管理分页显示简略记录
function vagueds(pageNo){
	//function vagueds(){
	var html;	
	//获取当月日期
	var date = new Date();
    var year = date.getFullYear() + "";
    var month = (date.getMonth() + 1) + "";
    // 本月第一天日期
    var begin = year + "-" + month + "-01"
    if($("#retime1").val()!=""){
    	begin = $("#retime1").val();
    }
    // 本月最后一天日期    
    var lastDateOfCurrentMonth = new Date(year,month,0);
    var end = year + "-" + month + "-" + lastDateOfCurrentMonth.getDate();
    if($("#retime2").val()!=""){
    	end = $("#retime2").val();
    }
    //获取输入的查询时间
    var begintime=$("#retime1").val();
    var endtime=$("#retime2").val();  
	 //获取输入的查询工号
    var reId=$("#reId1").val()*1;
  //获取输入的查询姓名
    var reName=$("#reName1").val();
  //获取输入的查询部门
    var deptNames=$("#deptNames1").val();
  //获取输入的查询状态
    var clock=$("#clock1").val();
    if("正常"==clock){
    	clock=0;
	}else if("迟到"==clock){
		clock=1;
	}else if("早退"==clock){
		clock=2;
	}else if("旷工"==clock){
		clock=3;
	}else{
		clock=88;
	} 
   
/*     $.get("${pageContext.request.contextPath}/AttenController",{op:"vaguesd"},function(datas){		 
		 $.each(datas,function(index,sta){ */
	 $.get("${pageContext.request.contextPath}/AttenController",{op:"vaguesd",pageNo:pageNo,
		 begintime:begintime,
		 endtime:endtime,
		 reId:reId,
		 empName:reName,
  		 deptName:deptNames,
  		 clockIn:clock,
		 pageSize:$(".scarsf").val()},function(datas){
		 $("#tbodyss").empty();  
    	 $("#pageItem").empty();
 		 $("#showPageInfo").empty();
    	 var pageNo=datas.pageNo;
    	 var totalPage=datas.totalPage;
    	 var pageSize=datas.pageSize;
    	 var totalCount=datas.totalCount;	
		 $.each(datas.data,function(index,sta){
			 var staId=sta.staId*1;			
				 xrPaging(staId,sta,begin,end); 		
		 })
		 addPaging(pageNo,totalPage,pageSize,totalCount);
	},"json").error(function(){
		alert("请输入正确的查询条件！")
	})	
}
		 
	//按条件查询考勤记录首页数据		 
	 function xrPaging(staId,sta,begin,end){
	 	 $.get("${pageContext.request.contextPath}/AttenController",{op:"vaguesf",empId:staId},function(data){		 
	 		 xrsj(staId,sta,begin,end,data);
	 		},"json")	 
	 }
	 //渲染考勤记录首页数据	
	 function xrsj(staId,sta,begin,end,data){
	 	html='<td>'+data.empName+'</td><td>'+data.dept.deptName+'</td>';
	 	var empId=data.empId;
	 	var normalDays=sta.normalDays;					
	 	var lateDays=sta.lateDays;					
	 	var earlyDepdays=sta.earlyDepdays;					 
	 	var leaveDays=sta.leaveDays;
	 		 									
	 	$("#tbodyss").append(' <tr>'+
	 		'<td class="empIdy">'+empId+'</td>'+html+					         
	 		'<td class="normalDays">'+normalDays+'</td>'+
	 		'<td class="lateDays">'+lateDays+'</td>	'+	
	 		'<td class="earlyDepdays">'+earlyDepdays+'</td>'+
	 		'<td class="leaveDays">'+leaveDays+'</td>'+
	 		'<td>'+begin+'</td>'+
	 		'<td>'+end+'</td>'+			                    
	 		'<td><a href="" data-toggle="modal" data-target="#myModal" data-empid="'+empId+'"'+
	 	         'data-begin="'+begin+'"'+
	 	         'data-end="'+end+'" id="vaguefs">'+					  	
	 			 '<button class="btn btn-success">异常记录 </button></a>	'+		           
	 		'</tr>   '); 
	 }
function addPaging(pageNo,totalPage,pageSize,totalCount){
	//显示分页信息
 	
		$("#showPageInfo").append("当前第<span id='pageNo'>"+pageNo+"</span>页/共<span id='totalPage'>"+totalPage+
				                  "</span>页/每页显示<span id='pageSize'>"+pageSize+"</span>条/共<span id='totalCount'>"+totalCount+"</span>条数据");

	   //首页
	   if(1==pageNo){
		   $("#pageItem").append('<li id="sy" class="disabled"><a href="#">首页</a></li>');
	   }else{
		   $("#pageItem").append('<li class="sy"><a href="#">首页</a></li>');
	   }
	  //上一页
	   if(1==pageNo){
		   $("#pageItem").append('<li class="disabled"><a href="#">上一页</a></li>');
	   }else{
		   $("#pageItem").append('<li class="syy"><a href="#">上一页</a></li>');
	   }
	   //显示分页栏目
	   for(var i=1;i<=totalPage;i++){
		   
		    if(i==pageNo){
			   $("#pageItem").append('<li class="active"><a href="#">'+i+'</a></li>');
		   }else{			   
				if(i==pageNo-2 ||i==pageNo-1 || i==pageNo+1 || i==pageNo+2){
					$("#pageItem").append('<li class="dqy"><a href="#">'+i+'</a></li>');
				}  			    			 			 
		   } 
	   }
	   //下一页
	   if(pageNo==totalPage){
		   $("#pageItem").append('<li class="disabled"><a href="#">下一页</a></li>');
	   }else{
		   $("#pageItem").append('<li class="xyy"><a href="#">下一页</a></li>');
	   }
	   //末页
	   if(pageNo==totalPage){
		   $("#pageItem").append('<li id="my" class="disabled"><a href="#">末页</a></li>');
	   }else{
		   $("#pageItem").append('<li class="my"><a href="#" >末页</a></li>');
	   }
	   //跳转页
	    $("#pageItem").append('<li><a href="#"><input type="number" id="yema" value="'+pageNo+'" min="1" max="'+totalPage+
	    		'" style="width:35px;height:15px;margin:0px"/></a></li>');
	    $("#pageItem").append('<li><a href="#" id="tiao">跳转</a></li>');
	}
//后台考勤管理显示模态框详情记录
function vagueFun(empId,begin,end){	
	//获取输入的查询状态
    var clock=$("#clock1").val();
    if("正常"==clock){
    	clock=0;
	}else if("迟到"==clock){
		clock=1;
	}else if("早退"==clock){
		clock=2;
	}else if("旷工"==clock){
		clock=3;
	}else{
		clock=88;
	} 
	$.get("${pageContext.request.contextPath}/AttenController",{op:"vaguefs",empId:empId,begin:begin,end:end,clockIt:clock},function(datas){
		$.each(datas,function(index,record){
			var recordId=record.recordId;
			var beginTime=record.beginTime.substring(0,16);
			var endTime=record.endTime == null ? "未打卡" : record.endTime.substring(0,16) ;
			var clockInDetails=record.clockInDetails;
			if(clockInDetails==1){
				clockInDetails="迟到";
			} if(clockInDetails==2){
				clockInDetails="早退";
			} if(clockInDetails==3){
				clockInDetails="旷工";
			} 
			$("#myModal #tbodyfs").append('<tr>'+
				'<td>'+recordId+'</td>'+
				'<td>'+empId+'</td>'+				      			        
				'<td>'+beginTime+'</td>'+	
				'<td>'+endTime+'</td>'+	
				'<td>'+clockInDetails+'</td>'+	           
				'<td><a href="" data-toggle="modal" data-target="#myModal3" '+	
				'onclick="modifyFun(this)" data-empid="'+empId+'"'+
			         'data-begintime="'+beginTime+'"'+
			         'data-endtime="'+endTime+'"'+
			         'data-recordid="'+recordId+'"'+
			         'data-clockindetails="'+clockInDetails+'"> '+	
					'<button class="btn btn-success">修改</button></a>'+	
					'<button class="btn btn-danger dels" data-recordid="'+recordId+'" type="button">删除</button></td>'+	
					'</tr>   ');				 
		})
	},"json")	    
}
//后台考勤管理修改模态框赋值
function modifyFun(obj){    	
	   	var empId=$(obj).data("empid");
	   	var recordId=$(obj).data("recordid");
	   	
		var beginTime1=$(obj).data("begintime").substring(0,10);
	  	var beginTime2=$(obj).data("begintime").substring(11);
	   	var beginTime=beginTime1+"T"+beginTime2;
	   	
	  	var endTime1=$(obj).data("endtime").substring(0,10);
	  	var endTime2=$(obj).data("endtime").substring(11);
	  	var endTime=endTime1+"T"+endTime2;
	  	
	  	var clockInDetails=$(obj).data("clockindetails");
	  	
	  	$("#myModal3 #recordIdg").val(recordId);
	   	$("#myModal3 #empIdg").val(empId);
	  	$("#myModal3 #beginTimeg").val(beginTime);
	  	$("#myModal3 #endTimeg").val(endTime); 
	 	$("#myModal3 #clockInDetailsg").val(clockInDetails);	
}    
</script>
</html>
